<template>
	<view>
		<!-- 上方导航栏 -->
		<mvBar :mysNavConfig="mysNavConfig" @onLeftClick="onLeftClick"></mvBar>
		<!-- 搜索栏 -->
		<view class="cssBox">
			<view>
				<u-search v-model="searchvalue" @change="search" shape="round" :clearabled="true" :show-action="true"
					actionText="反馈" @custom="gotoopinion" input-align="left">
				</u-search>
			</view>
		</view>
		<!-- 意见列表 -->
		<view class="list">
			<scroll-view class='scrolls' scroll-y="true" @scrolltolower='scroll'>
				<uni-list v-for="(item, index) in opinionlist" :key="index">
					<uni-list-item v-if="item.replyStatus==1" :title="item.title" :note="item.createdTime"
						:avatar-circle="true" thumb="/static/img/opinion.png" thumb-size="lg" :showArrow="false"
						clickable @click="opinionmassage(item)">
						<template v-slot:footer>
							<image class="slot-image" src="/static/img/dai.png" mode="widthFix"></image>
						</template>
					</uni-list-item>
					<uni-list-item v-if="item.replyStatus==2" :title="item.title" :note="item.createdTime"
						:avatar-circle="true" thumb="/static/img/opinion.png" thumb-size="lg" :showArrow="false"
						clickable @click="opinionmassage(item)">
						<template v-slot:footer>
							<image class="slot-image" src="/static/img/zhong.png" mode="widthFix"></image>
						</template>
					</uni-list-item>
					<uni-list-item v-if="item.replyStatus==3" :title="item.title" :note="item.createdTime"
						:avatar-circle="true" thumb="/static/img/opinion.png" thumb-size="lg" :showArrow="false"
						clickable @click="opinionmassage(item)">
						<template v-slot:footer>
							<image class="slot-image" src="/static/img/yi.png" mode="widthFix"></image>
						</template>
					</uni-list-item>
				</uni-list>
			</scroll-view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				mysNavConfig: {
					/* 占位开启  */
					navPadding: true,
					/* 背景 */
					bgColor: "#0055ff",
					/* 标题 （屏幕中心居中 两边图标中心居中使用slot center1） */
					navTitle: {
						text: "我的反馈",
						color: "#ffffff",
						fontSize: "20px", // px upx rpx
						fontWeight: "500", // 100 - 700
					},
					isCustomFn: true,
					btnType: "type2",
					type2Config: {
						// 左图标
						leftPath: "/static/img/back.png",
						// 右图标
						rightPath: "/static/img/home.png",
						// 圆角
						radius: "40rpx",
					}
				},
				userInfo: '',
				searchvalue: '',
				yema: {
					count: 0,
					page: 1,
					limit: 15,
					title: ''
				},
				opinionlist: []
			}
		},
		onLoad() {
			this.userInfo = uni.getStorageSync('userInfo');
		},
		onShow() {
			this.getopinionlist()
		},
		methods: {
			//获取意见列表
			getopinionlist() {
				uni.request({
					url: getApp().globalData.serverAddress + this.$uri.Url_lookopinionlist.replace("{userRealId}",
						this.userInfo.userRealId),
					data: {
						page: this.yema.page,
						limit: this.yema.limit,
						title: this.yema.title
					},
					dataType: "json",
					method: "GET",
					success: (resData) => {
						this.opinionlist = resData.data.data
						this.yema.count = resData.data.count
					},
					fail: (resData) => {
						this.$utils.showToast(this, resData.data.msg, 'error', 1, '');
					},
					complete: () => {
						uni.hideLoading();
					}
				})
			},
			//搜索
			search(value) {
				this.yema.title = value
				this.getopinionlist()
			},
			//跳转反馈页面
			gotoopinion() {
				uni.redirectTo({
					url: '/pages/userCenter/suggestion'
				})
			},
			scroll() {
				if (this.yema.limit < this.yema.count) {
					this.yema.limit += 10
					this.getopinionlist()
				}
			},
			//跳转意见详情页
			opinionmassage(value) {
				var url = '/pages/userCenter/opinion?opinionid=value'
				url = url.replace("value", value.suggestionRealId)
				uni.navigateTo({
					url: url
				})
			},
			//返回
			onLeftClick() {
				uni.switchTab({
					url: '/pages/tabbar/userCenter'
				})
			}
		}

	}
</script>

<style lang="scss" scoped>
	.slot-image {
		/* #ifndef APP-NVUE */
		display: block;
		/* #endif */
		margin-right: 10px;
		width: 50px;
		height: 50px;
	}

	.scrolls {
		height: 100%;
	}

	.list {
		margin: 10px 0px;
		height: 715px;
		overflow: hidden
	}

	.cssBox {
		padding: 20rpx 30rpx;
		background-color: #FFFFFF;
		margin-bottom: 15rpx;
	}
</style>
